<template>
  <div class="reward">
    <mt-header title="全球分红记录">
      <router-link to="/user" slot="left">
        <mt-button icon="back"></mt-button>
      </router-link>
    </mt-header>
    <div class="reward-info">
      <table class="reward-table">
        <tr>
          <th>分红会员等级</th>
          <th>分红金额</th>
          <th>分红时间</th>
        </tr>
        <tr v-for="(item, index) of orderArray" :key="index">
          <td class="border-bottom">{{item.memberrank}}</td>
          <td class="border-bottom">{{item.amount}}</td>
          <td class="border-bottom">{{item.date}}</td>
        </tr>
      </table>

      <div v-show="!orderArray" class="not-reward">---没有更多的数据---</div>
    </div>
  <public-menu></public-menu>
  </div>
</template>

<script>
import axios from 'axios'
import PublicMenu from '../public/Menu'
export default {
  name: 'GlobalPoint',
  data () {
    return {
      orderArray: []
    }
  },
  components: {
    PublicMenu
  },
  methods: {
    getInfo () {
      axios.get('/meimai/interface/reward/list', {
        params: {
          'memberId': this.$store.state.userId
        }
      }).then((res) => {
        let datas = res.data
        console.log('dd', datas)
        if (datas.code === 0 && datas.array) {
          this.orderArray = datas.array
        }
      })
    }
  },
  mounted () {
    this.getInfo()
  }
}
</script>

<style lang="stylus" scoped>
@import '~styles/mixins.styl'
@import '~styles/varibles.styl'
.mint-header
  background: #ec2935
.reward-info
  position: absolute
  top: .8rem
  bottom: .98rem
  width: 100%
  background: $eee
  .reward-table
    width: 100%
    text-align: center
    background: #fff
    th
      background: #fff
      padding: .3rem 0
    td
      padding: .36rem 0
  .not-reward
    text-align: center
    color: $cologray
    margin-top: .3rem
</style>
